<template>
	<view :class="$tm.vx.state().tmVuetify.black?'black bk':''">
		<tm-menubars title="粘性布局" color="bg-gradient-primary-lighten" :showback="true"></tm-menubars>
		<tm-sheet height="300" :shadow="24"></tm-sheet>
		<tm-sticky :top="top" model='static'>
			<tm-sheet color="primary" :margin="[32,0]">滑动自动置顶（非h5端使用scroll模拟）</tm-sheet>
		</tm-sticky>
		<tm-sticky :top="0" model='bottom'>
			
			<tm-sheet color="primary">
				<view class="pa-36">底部</view>
			</tm-sheet>
		</tm-sticky>
		<tm-sheet height="2000" :shadow="24"></tm-sheet>
	</view>
</template>

<script>
	import tmFullView from "@/tm-vuetify/components/tm-fullView/tm-fullView.vue"
	import tmMenubars from "@/tm-vuetify/components/tm-menubars/tm-menubars.vue"
	import tmSheet from "@/tm-vuetify/components/tm-sheet/tm-sheet.vue"
	import tmSticky from "@/tm-vuetify/components/tm-sticky/tm-sticky.vue"
	export default {
		components:{tmFullView,tmMenubars,tmSheet,tmSticky},
		data() {
			return {
				top:0,
			}
		},
		mounted() {
			this.top = uni.getSystemInfoSync().statusBarHeight + 45 + this.top;
		},
		methods: {
			
		}
	}
</script>

<style>

</style>
